import type { ComponentsConfig, ComponentsConfigRaw } from '../../types'
import { extendSchemas } from '@/components/cms/utils'
import advsConfig from './base/advs'
import { titleTabbar, categoriesGrid, commonList } from './simples'

const basePath = 'template.articleHome'
const config: ComponentsConfig = {
  default: 'titleTabbar',
  components: extendSchemas<ComponentsConfigRaw>(
    {
      titleTabbar: titleTabbar({
        pageFields: {
          background: `${basePath}.background`
        },
        fields: {
          background: `${basePath}.content.appBar.background`,
          titleColor: `${basePath}.content.appBar.titleColor`
        }
      }),
      categoriesGrid: categoriesGrid({
        sort: 2,
        title: 'article',
        pageFields: {
          background: `${basePath}.background`
        },
        fields: {
          background: `${basePath}.content.categoriesGrid.background`,
          cols: `${basePath}.content.categoriesGrid.cols`,
          style: `${basePath}.content.categoriesGrid.style`
        }
      }),
      articleList: commonList({
        sort: 3,
        type: 'article',
        title: '文章列表',
        pageFields: {
          background: `${basePath}.background`
        },
        fields: {
          title: {
            color: `${basePath}.content.articleList.title.color`,
            size: `${basePath}.content.articleList.title.size`,
            letterSpacing: `${basePath}.content.articleList.title.letterSpacing`,
            lineHeight: `${basePath}.content.articleList.title.lineHeight`
          },
          layout: {
            style: `${basePath}.content.articleList.layout.style`,
            limit: `${basePath}.content.articleList.layout.limit`
          }
        }
      })
    },
    advsConfig(['playerBeforeAdv', 'playerPauseAdv'])
  )
}
export default config
